<template>
  <div>
    <h3>1.表格嵌套输入框。</h3>
      <el-table
        :data="tableData"
        ref="multipleTable"
        style="width: 100%"
		highlight-current-row
		border
		:header-cell-style="{background:'#f0f1f5',color:'#2a2e38',fontWeight: 'normal'}"
        @selection-change="handleSelectionChange"
      >
        <!-- <el-table-column type="selection" width="55" align="center"></el-table-column> -->
        <el-table-column label="文件名" width="150">
          <template slot-scope="scope">
            <span>{{ scope.row.fileName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="导入总数" width="150">
          <template slot-scope="scope">
            <span>{{ scope.row.allNumber }}</span>
          </template>
        </el-table-column>
        <el-table-column label="开户信息导入成功" width="150">
          <template slot-scope="scope">
            <span style="color: #52c41a;">{{ scope.row.khSeccess }}</span>
          </template>
        </el-table-column>
        <el-table-column label="开户信息导入失败" width="150">
          <template slot-scope="scope">
            <span style="color: #e6441a;">{{ scope.row.khErrer }}</span>
          </template>
        </el-table-column>
        <el-table-column label="交易明细导入成功" width="150">
          <template slot-scope="scope">
            <span style="color: #52c41a;">{{ scope.row.jySeccess }}</span>
          </template>
        </el-table-column>
        <el-table-column label="交易明细导入失败" width="150">
          <template slot-scope="scope">
            <span style="color: #e6441a;">{{ scope.row.jyErrer }}</span>
          </template>
        </el-table-column>
        <el-table-column label="姓名" width="180">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.name"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="身份证号" width="180">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.idCard"></el-input>
          </template>
        </el-table-column>
      </el-table>
      <!-- <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="saveTableData">保 存</el-button>
      </span> -->
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [],
      selectData: [],
      userDefinedData: [
        { fileName: "hhhhhhhhh.xls", allNumber: 10, khSeccess: 10, khErrer: 0,jySeccess: 88,jyErrer:2,name: 'tix',idCard: '515151199919191919'},
        { fileName: "uuuuuu.xls", allNumber: 11, khSeccess: 15,khErrer: 3,jySeccess:9,jyErrer:4,name: '', idCard: '515151252125555'}
      ]
    };
  },
  mounted() {
    this.tableData = this.userDefinedData;
  },
  methods: {
    saveTableData() {
      let i = 0;
      this.selectData.length == 0
        ? this.$message.error("未选中任何选项!")
        : this.selectData.map(item => {
            if (item.minReference == "" || item.maxReference == "") {
              i++;
            }
          })
      i != 0
        ? this.$message.error("选中选项的值不可以为空!")
        : window.console.log(this.userDefinedData);
    },
    handleSelectionChange(val) {
      this.selectData = val;
    },
    show(stated, list) {
      this.selectData = list;
    },
  }
};
</script>
<style lang="scss" scoped></style>